Externe CSS
link tag.Syntaxis
Maar we kunnen nog verder gaan. We kunnen de stijl in een ander bestand opslaan, namelijk een extern stijlblad. In ons voorbeeld plaatsen we de stijlregels in het bestand app.css:
p
{
font-family: Verdana;
color: Fuchsia;
}
In de HTML-documenten volstaat het met behulp van het link element een eenvoudige verwijzing naar het extern stijlblad te maken:
<head>
<title>CSS</title>
<link href="css/app.css" rel="stylesheet" type="text/css" />
</head>
Wanneer de auteur iets aan een gebruikte stijl wil wijzigen, hoeft de wijziging niet in elk document afzonderlijk, maar slechts op één plaats in het stijlblad te worden aangebracht.
Ik verkies deze manier omdat die het best beantwoordt aan de lasagnefilosofie.
Toepassing
External Style Sheets worden gebruikt voor grote sites met veel pagina's, omdat de stijlinformatie van alle pagina's in een document gezet kan worden. Wil je de stijl van je pagina's veranderen, dan hoef je slechts een document te veranderen om alle pagina's aan te passen! Dit geeft consistentie aan je website.
We gaan een extern css bestand creëren voor onze website. We beginnen met een folder te maken met de naam css in onze webroot multimedia en daarin maken we een bestand met de naam app.css.